<!DOCTYPE html> 
<html>
<head>
<meta charset="utf-8">
<title>phonegap_device_network_notification01</title>
<link href="../jquery.mobile-1.3.2.css" rel="stylesheet" type="text/css"/>
<script src="../jquery.js" type="text/javascript"></script>
<script src="../jquery.mobile-1.3.2.js" type="text/javascript"></script>
<script src="../cordova.js" type="text/javascript"></script>
<script type="text/javascript">
	$(document).ready(function(){
			document.addEventListener("deviceready", myDeviceReadyListener, false);	
	});
	
	function myDeviceReadyListener(){
		$("#Alert").click(function(){
			showAlert();
		});
		
		$("#NoConfirm").click(function(){
			showConfirm();
		});
		
		$("#prompt").click(function(){
			showPrompt();
		});		
		
		$("#NoBeep").click(function(){
			beep();
		});			
		
		
		$("#NoVibrate").click(function(){
			vibrate();
		});				
		
		
		//alert
		function showAlert(){
			navigator.notification.alert(
				'提示的信息',//message
				alertcallback,  //callback
				'提示信息title',//title
				'确定' //button
			
			);
		}
		
		//callback
		function alertcallback(){
			alert('alertCallback');
		
		}
		
		
		//confirm
		function showConfirm(){
			navigator.notification.confirm(
				'你吃屎了吗？',//message
				onConfirm,//callback
				'提示信息',//title
				'吃了,没吃'//buttonlabels
			);
		}
		function onConfirm(info){
			var v='';
			if(info==1){
				v='吃了';
			}
		
			alert('你'+v);
		}
		
		
		//prompt
		function showPrompt() {
		    navigator.notification.prompt(
		        '请输入您的姓名',  // message
		        onPrompt,                  // callback to invoke
		        '标题',            // title
		        ['确定','取消','ok'],             // buttonLabels
		        '这是默认的信息'                 // defaultText
		    );
		}		
		
		//call back
		function onPrompt(info){
			//buttonIndex =>buttonLabels num
			//input1 => text value
			alert(info.buttonIndex+'------------'+info.input1);

		}

		//提示音   
		function beep(){
			navigator.notification.beep(2);//声音的次数
		}


		//震动 毫秒
		function vibrate() {
        	navigator.notification.vibrate(2000);
    	}
	}

</script>
</head> 
<body>
<div data-role="page">
		<div data-role="header">
			<h1>PhoneGap100实战</h1>
		</div>
		<div data-role="content">
			<a href="#" data-role="button" id="Alert">弹出提示框</a>
			<a href="#" data-role="button" id="NoConfirm">弹出确认框</a>
			<a href="#" data-role="button" id="prompt">prompt对话框</a>
			<a href="#" data-role="button" id="NoBeep">提示音</a>
			<a href="#" data-role="button" id="NoVibrate">震动</a>
		</div>
		<div data-role="footer">
			<h4>&nbsp;</h4>
		</div>
</div>

</body>
</html>
